/**
* 因为在h5中使用时，全局的组件没有很好的实现方法，所以在uniapp外单独挂载一层，如果有更好的方式可以替换此方法。
* Tip: 1、使用Toast
*/
<template>
	<view class="dam-h5">
		<damToast class="damToast" ref="damToastI"></damToast>
		<uv-popup ref="contentPop" mode="right" z-index="100">
			<view class="v_popContent">
				<index class="v_popComponent"> </index>
			</view>
		</uv-popup>
	</view>
</template>

<script lang="ts" setup>
	// TODO  这里的弹窗zindex先写死
	import { onMounted, ref } from 'vue';
	import damToast from '@/dam_common/components/view/dam-toast.vue'
	import { getAbilityController } from "@/dam_uni_frame/utils/DamApi"
	import { IDamPageService } from '@/dam_common/abilitys/interface/IDamPageService';
	import { PLANTFORM, SERVICE_NAME } from '@/dam_common/abilitys/Constants';
	import { usePageStore } from "@/dam_uni_frame/stores/stores";
	import uvPopup from '@/uni_modules/uv-popup/components/uv-popup/uv-popup.vue'
	import index from '@/subs/jz_app/pages/p_login/index.vue'

	const pageStore = usePageStore();

	const damToastI = ref(null);
	const contentPop = ref();

	const showToast = (text) => {
		damToastI.value.show(text);
	};

	const showContentPop = (option) => {
		contentPop.value.open();
	};
	onMounted(() => {
		let controller = getAbilityController();
		controller.addService(damH5PageService);
	});


	const damH5PageService : IDamPageService = {
		showToast: function (page : any, text : string, plantform ?: PLANTFORM) : boolean {
			if (!text || text === '') {
				return true;
			}
			showToast(text);
			return true;
		},
		getPlantform: function () : PLANTFORM {
			return PLANTFORM.DAMPAGE;
		},
		getSoftIndex: function () : number {
			return 100;
		},
		getServiceName: function () : SERVICE_NAME {
			return SERVICE_NAME.DamPageService;
		},
	}
	// import damToast from '@/dam_common/components/view/dam-toast.vue'
	// let pageService
	// let thisPage
	// export default {
	// 	name: "dam-h5-page",
	// 	components: {
	// 		damToast,
	// 	},
	// 	data() {
	// 		return {
	// 		}
	// 	},
	// 	mounted() {
	// 		thisPage = this
	// 	},
	// 	methods: {
	// 		setPageService(service) {
	// 			pageService = service
	// 			pageService.bindPage(this)
	// 		},
	// 		showToast(text) {
	// 			thisPage.$refs.damToast.show(text);
	// 		}
	// 	}
	// }
</script>

<style lang="scss" scoped>
	@import "/dam_uni_frame/styles/dam_theme_common.scss";

	.dam-h5 {
		// height: 100vh;
		// width: 100vw;
		background-color: transparent;
	}

	.damToast {
		margin-bottom: v-bind("pageStore.getSafeAreaBottomHeight()");
	}

	.v_popContent {
		height: 100%;
		width: 300px; //TODO 这里需要调整

		.v_popComponent {
			height: 100%;
			width: 100%;
		}
	}
</style>